import React, {useEffect, useState} from "react";
import {View} from "@tarojs/components";
import {FixedView, Uploader} from "@taroify/core";
import {Plus} from "@taroify/icons"
import styles from "./index.module.scss";
import Taro from "@tarojs/taro";
import {getParams, infoToast} from "@/_framework/services/Taro";
import {goHome} from "@/_framework/services/Go";
import {chooseImage, uploadImages} from "@/_framework/services/Upload";
import {add} from "@/_framework/services/Data";

const Index: React.FC = () => {
    const [files, setFiles] = useState<Uploader.File[]>([])
    const count = 6

    const [submitIng, setSubmitIng] = useState(false)

    const [activityId, setActivityId] = useState<any>()
    useEffect(() => {
        load();
    }, []);

    const load = async () => {
        let {activityId: _activityId} = getParams();
        if (!_activityId) {
            return await goHome()
        }
        setActivityId(_activityId)
    };

    const onUpload = async () => {
        const images = await chooseImage(count)
        setFiles([...files, ...images])
    }


    const doSubmit = async () => {
        if (submitIng) {
            infoToast('上传中');
            return;
        }
        if (files.length == 0) {
            infoToast('请上传资料');
            return;
        }
        if (files.length > count) {
            infoToast(`最多上传${count}张图片`);
            return;
        }

        setSubmitIng(true)
        Taro.showLoading()

        const res = await uploadImages(files);
        if (!res) {
            infoToast('上传失败');
        }

        const payload = res
            .map(({height, width, size, url, type}) => ({
                height: height || 0,
                width: width || 0,
                size: size || 0,
                resourceUrl: url,
                resourceType: type || 'unknown',
                activityId
            }));
        const {success} = await add('turing/index/activityResources', payload)
        if (success) {
            infoToast('上传成功');
        }
        Taro.hideLoading()
        await goHome()
    }


    return (
        <View className={styles.page}>
            <View className={styles.page_top}>
                <View className={styles.page_top_left}>
                    *
                </View>
                <View className={styles.page_top_right}>
                    请上传资料
                </View>
            </View>
            <View className={styles.page_center}>
                请上传活动相关截图，单个图片/文件大小不超过3M
            </View>

            <View className={styles.page_center_upload}>
                <Uploader className={styles.page_upload} value={files} multiple maxFiles={count} onUpload={onUpload}
                          onChange={setFiles}
                >
                    <View className={styles.page_upload_item}>
                        <Plus className={styles.page_upload_item_icon} style={{color: "#ca3a3a"}}></Plus>
                        <View className={styles.page_upload_item_txt}>
                            添加图片/文件
                        </View>
                    </View>
                </Uploader>
            </View>


            <FixedView position='bottom'>
                <View className={styles.page_bottom} onClick={doSubmit}>
                    提交
                </View>
            </FixedView>
        </View>
    );
};

export default Index;
